<template>
  <div class="demo-split" style="overflow:hidden;">
      <Split v-model="split1">
          <div slot="left" class="demo-split-pane">
              <!-- 左侧附件影像 -->
            <marvels-viewer :data="viewerData" :attachMents="attachMents" :fileParam="fileParam" :isScroll="isScroll"></marvels-viewer>
            <!-- <Button  type="primary" @click="back">返回</Button> -->
          </div>

          <div slot="right" class="demo-split-pane">

              <div style="float:left;margin-top:0px;margin-left:10px" v-if="taskParams.isModal==false">
                 <Button  type="primary" @click="back">返回</Button>
              </div>

          </div>
      </Split>
  </div>
</template>

<script>
import marvelsViewer from '../../components/marvels-viewer.vue'
import attachmentTypeData from '../../components/attachment-type-data.js'
export default {
  name: 'capital-fund-task-detail-component',
  components: {
    marvelsViewer
  },
  data () {
    return {
      split1: 0.5,
      isShowNode: '',
      hungReason: '', // 挂起原因
      hungReasonCode: '',
      hangUpStatus: '',
      isScroll: false,
      viewerData: [
        // {
        //   label: '身份证',
        //   children: [
        //     {
        //       label: '身份证正面',
        //       src: 'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1526911041826&di=0da991a37474574a96bfee54d69b5ff6&imgtype=0&src=http%3A%2F%2Ff.hiphotos.baidu.com%2Fexp%2Fw%3D480%2Fsign%3D60e30eebd2c8a786be2a4b065708c9c7%2F962bd40735fae6cd3e7505700cb30f2443a70fd9.jpg'
        //     },
        //     {
        //       label: '身份证反面',
        //       src: 'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1526911041821&di=4ed276b0a6d6192d9167c29606350416&imgtype=0&src=http%3A%2F%2Fp19.qhimg.com%2Ft01e41f04fe62724da1.jpg'
        //     }
        //   ]
        // },
        // {
        //   label: '房产相关图片',
        //   children: [
        //     {
        //       label: '001',
        //       src: 'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1526911111616&di=cbff46a453cf48e588c2ed1a4db9c1ec&imgtype=0&src=http%3A%2F%2Fwww.hhinfo.ac.cn%2Fwcm.files%2Fupload%2FCMShhkjj%2F201609%2F201609301025046.jpg'
        //     },
        //     {
        //       label: '002',
        //       src: 'https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=2116275205,2726731435&fm=27&gp=0.jpg'
        //     },
        //     {
        //       label: '003',
        //       src: 'https://bpic.588ku.com/PPt_origin_pic/pptyj/00/00/43/pptyj/8e3692c857b5a51a51cfff7e6e8e210c.jpg-0.jpg!rh1300/fw/892/quality/90/unsharp/true/compress/true'
        //     }
      //     ]
      //   },
      //   {
      //     label: '合同',
      //     children: [
      //       {
      //         label: '001',
      //         type: 'pdf',
      //         src: 'http://mozilla.github.io/pdf.js/web/compressed.tracemonkey-pldi-09.pdf'
      //       }
      //     ]
      //   }
      ],
      fileParam: {
        url: this.$appContext.marvels_core_approve + '/approve/credit/report/service/uploadFile?loanId=' + this.$route.query.loanId + '&atmtTypeName=' + marvelsViewer.atmtTypeName + '&AtmtType=' + marvelsViewer.AtmtType,
        isShow: true
      },
      attachMents: [],
      res1: ['150000', null, null],
      baseUrl: this.$appContext.marvels_core_approve,
      $ajax: null,
      curTab: null,
      curLoanId: '',
      modal1: false,
      taskParams: {// 传递给子tab的参数对象
        curLoanId: '', // this.$route.query.id,
        custCardNo: null, // 身份证
        customerInfo: false, // tab页签name，默认不加载数据
        loanCreditReporting: false,
        loanInfo: false,
        creditData: false,
        riskParams: false,
        crossCheck: false,
        decisionResult: false,
        approvalResult: false,
        circulationLog: false,
        riskTipsForm: false,
        type: '',
        nodeCode: null // 当前页面所属流程节点
      },
      headData: []
    }
  },
  methods: {
    // 初始化下拉列表数据
    initSelectData () {
      var vm = this
      // 查询
      var loanId = this.$route.query.loanId
      this.$ajax.post(this.baseUrl + 'approve/process/task_process/service/getSdxdUploadAttamentTypes', loanId).then(re => {
        var data = re.data
        var code = data.code
        var message = data.message
        if (code !== 'success') {
          this.$Message.warning(message)
          return
        }
        var attachmentDatas = data.data || []
        attachmentDatas.forEach(item => {
          var tData = {}
          tData.label = item.atmtTypeName
          tData.value = item.atmtType
          // debugger;
          vm.attachMents.push(tData)
        })
      }).catch(er => {

      })
    },
    hangUp () {
      var vm = this
      vm.modal1 = true
    },
    back () {
      this.$router.go(-1)
      // this.$router.push({ name: 'capital-operation/capital-fund-task-detail', params: {} })// 类似post传参
    },
    initpage: function () {
      var vm = this
      var url = this.baseUrl + 'approve/process/task_process/service/getLoanInfo/' + this.taskParams.curLoanId
      this.$ajax.get(url).then(re => {
        var data = re.data
        var code = data.code
        var message = data.message
        if (code !== 'success') {
          this.$Message.warning(message)
          return
        }
        vm.loanInfoForm = data.data
        vm.hangUpStatus = data.data.caseDTO.status
        // 初始化任务处理详情-表头信息
        // vm.initHeadTable()
        // 加载默认tab页签数据
        vm.taskParams.custCardNo = vm.loanInfoForm.custCardNo
        vm.taskParams[this.curTab] = true
      }).catch(er => {

      })
    },
    // 初始化任务处理详情-表头信息
    initHeadTable () {
      var vm = this
      var rowData = {}
      this.columns1.forEach(function (val, index) {
        var columnKey = val.key
        Object.keys(vm.loanInfoForm).forEach(function (key) {
          if (columnKey === key) {
            rowData[columnKey] = vm.loanInfoForm[key]
          }
        })
      })
      this.headData = [rowData]
    },

    cancel () {
      this.modal1 = false
    },
    // 查询流程
    queryCase () {
      var params = {}
      var loanId = this.$route.query.loanId// '17050617222455105';//测试loanId
      this.$ajax.post(this.$appContext.marvels_core_approve + 'approve/loanapplycase/service/getLoanApplyCase/' + loanId, params).then(re => {
        if (re.data.code === 'success') {
          this.isShowNode = re.data.data.curNodeCode
          this.taskParams.nodeCode = re.data.data.curNodeCode
          if (this.isShowNode !== 'woChecking' && this.isShowNode !== 'woApproval' && this.isShowNode !== 'woSampling' && this.taskParams.type !== 1) {
            this.isShowNode = 'woSampling'
          }
        } else {
          this.$Message.warning({ title: '提示', content: re.data.data, onOk () { } })
        }
      }).catch(er => {

      })
    },

    // 初始化附件影像
    initViewer () {
      var vm = this
      var params = this.$route.query.loanId
      vm.$ajax.post(vm.$appContext.marvels_core_approve + 'approve/credit/report/service/getAttachmentsByViewKey?loanId=' + params).then(re => {
        var data = re.data
        var code = data.code
        var message = data.message
        if (code === 'success') {
          vm.initMediaData(data.data)
        } else {
          vm.$Message.error(message)
        }
        // this.submitWhy = false;
      }).catch(er => {

      })
    },
    initMediaData (data) {
      var list = []
      if (data && data.length > 0) {
        var baseSrc = this.baseUrl + 'approve/credit/intbank/service/loadAttachmentById/'
        for (var i = 0; i < data.length; i++) {
          var viewAttach = {}
          viewAttach.label = data[i].atmtTypeName
          var attachmentList = data[i].laAttachmentDTOList
          var viewList = []
          if (attachmentList && attachmentList.length > 0) {
            for (var j = 0; j < attachmentList.length; j++) {
              let label = attachmentTypeData[attachmentList[j].atmtType] + '_' + (j + 1)
              if ((attachmentList[j].atmtType === 'A' || attachmentList[j].atmtType === 'YH') && attachmentList[j].fileName !== '' && attachmentList[j].fileName !== null) {
                label = attachmentList[j].fileName
              }
              let fileLocation = attachmentList[j].fileLocation
              if (!fileLocation) fileLocation = ''
              let fileName = attachmentList[j].fileName
              if (!fileName) fileName = ''
              viewList.push({
                label: label,
                src: baseSrc + attachmentList[j].id,
                type: fileLocation.substring(fileLocation.lastIndexOf('.') + 1),
                fileType: attachmentList[j].atmtType,
                url: fileLocation
              })
            }
            viewAttach.children = viewList
            list.push(viewAttach)
          }
        }
      }
      this.viewerData = list
    }

  },
  computed: {

  },
  mounted () {
    this.curTab = 'customerInfo'
  },
  created () {
    // var params = this.$route.query || {};
    // if(!params || params.loanId==null || params.loanId==""){
    //     this.$Message.warning("贷款产品申请编号为空");
    //     return;
    // }
    // this.curLoanId = params.loanId;
    this.taskParams.type = this.comptParams.type// 判断查询和修改
    this.taskParams.collapseCotrol = this.$route.query.collapseCotrol
    this.$ajax = this.$util.ajax()
    Object.assign(this.taskParams, this.comptParams)
    if (this.taskParams.isModal === false) {
      // this.initpage()
    }
    this.initSelectData()
    this.queryCase()
    this.initViewer()
  },
  watch: {
    'comptParams.isModal' (v) {
      // 每次打开modal，初始化tabs状态
      if (v) {
        Object.assign(this.taskParams, this.comptParams)
        this.taskParams.customerInfo = false
        this.taskParams.loanInfo = false
        this.taskParams.creditData = false
        this.taskParams.riskParams = false
        this.taskParams.crossCheck = false
        this.taskParams.decisionResult = false
        this.taskParams.approvalResult = false
        this.taskParams.circulationLog = false
        this.taskParams.riskTipsForm = false
        this.taskParams.loanCreditReporting = false
        this.curTab = 'customerInfo'
        this.taskParams.customerInfo = true
        this.initpage()
      }
    }
  },
  props: {
    comptParams: Object
  }
}
</script>

<style lang="less">
.task-process-detail-select {
  width: 168px;
}
.ivu-tabs-bar {
  border-bottom: 1px solid #dddee1;
  margin-bottom: 1px;
}
.demo-split{
    height: 780px;
    // border: 1px solid #dcdee2;
}
.demo-split-pane{
    // padding: 10px;
}
.tabs-tabPane{
  height:550px;
  overflow-y:auto;
}
</style>
